<template>
	<view>
		<view class="swiper">
      <swiper :indicator-dots="true" :autoplay="true" :interval="3000" :duration="1000">
        <swiper-item>
          <view class="swiper-item">123</view>
        </swiper-item>
      </swiper>
    </view>
    <view class="item-box">
      <view class="item">这是标题</view>
      <button class="btn">立即购买</button>
    </view>
    <view class="item-box1">
      <view class="item">这是标题</view>
      <button class="btn">立即购买</button>
    </view>
    
    <view class="dayPurchase">每日抢购</view>
    <view class="tip">每日海量超值福利等你来拿</view>
    <view class="gotoMore">点击进入更多</view>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				
			};
		}
	}
</script>

<style lang="scss">
.swiper {
  width: 100%;
  height: 450rpx;
  .swiper-item {
    width: 100%;
    height: 900rpx;
    background-color: "#c00000";
  }
}
.item-box {
  width: 690rpx;
  height: 250rpx;
  margin-left: 30rpx;
  background: '#FFFFFF';
  box-shadow: 0px 0px 10px 3px rgba(132, 132, 132, 0.23);
  border-radius: 19px;
  overflow: hidden;
  .item {
    width: 335rpx;
    height: 70rpx;
    margin-left: 330rpx;
    margin-top: 48rpx;
    border: 1px solid #333333;
  }
  .btn {
    width: 195rpx;
    height: 50rpx;
    background: '#202029';
    border-radius: 25px;
    text-align: center;
    line-height: 50rpx;
    font-size: 24rpx;
    color: '#FFFEFE';
    margin-left: 404rpx;
    margin-top: 39rpx;
  }
}

.item-box1 {
  width: 690rpx;
  height: 250rpx;
  margin-left: 30rpx;
  background: '#FFFFFF';
  box-shadow: 0px 0px 10px 3px rgba(132, 132, 132, 0.23);
  border-radius: 19px;
  overflow: hidden;
  .item {
    width: 335rpx;
    height: 70rpx;
    margin-right: 335rpx;
    margin-top: 48rpx;
    border: 1px solid #333333;
  }
  .btn {
    width: 195rpx;
    height: 50rpx;
    background: '#202029';
    border-radius: 25px;
    text-align: center;
    line-height: 50rpx;
    font-size: 24rpx;
    color: '#FFFEFE';
    margin-left: 20rpx;
    margin-top: 39rpx;
  }
}

.dayPurchase {
  width: 230px;
  height: 55rpx;
  font-size: 59rpx;
  font-family: Source Han Sans CN;
  font-weight: 400;
  color: #05072E;
  line-height: 48px;
  margin-left: 235rpx;
  margin-top: 62rpx;
}

.tip{
  width: 340rpx;
  height: 27rpx;
  font-size: 28rpx;
  font-family: Source Han Sans CN;
  font-weight: 400;
  color: #202029;
  line-height: 48rpx;
  margin-left: 186rpx;
  margin-top: 35rpx;
}

.gotoMore{
  width: 150rpx;
  height: 23rpx;
  float: right;
  margin-right: 49rpx;
  margin-top: 58rpx;
  font-family: Source Han Sans CN;
  font-size: 24rpx;
  color: #666666;
  line-height: 48px;
}
</style>
